﻿@page "/tree-grid/pagingAPI"

@using Syncfusion.Blazor.TreeGrid
@using Syncfusion.Blazor.Grids
@using Syncfusion.Blazor.Data
@using Syncfusion.Blazor.DropDowns
@using Syncfusion.Blazor.Buttons
@using Syncfusion.Blazor.Inputs
@using Syncfusion.Blazor
@*Hidden:Lines*@
@using BlazorDemos
@using ej2_blazor_treedata
@inherits SampleBaseComponent;
@*End:Hidden*@

<div class="col-lg-12 control-section">
    <div class="content-wrapper">
        <div class="row">
            <SfTreeGrid TValue="BusinessObject" ChildMapping="Children" TreeColumnIndex="1" AllowPaging="true">
                <SfDataManager Json="@TreeGridData" Adaptor="Adaptors.JsonAdaptor"></SfDataManager>
                <TreeGridPageSettings PageSizes="true" PageCount="2" PageSize="10"></TreeGridPageSettings>
                <TreeGridColumns>
                    <TreeGridColumn Field="TaskId" HeaderText="Task ID" Width="80" IsPrimaryKey="true" TextAlign="TextAlign.Right"></TreeGridColumn>
                    <TreeGridColumn Field="TaskName" HeaderText="Task Name" Width="180"></TreeGridColumn>
                    <TreeGridColumn Field="StartDate" HeaderText="Start Date" Format="d" Type=ColumnType.Date Width="90" TextAlign="TextAlign.Right"></TreeGridColumn>
                    <TreeGridColumn Field="EndDate" HeaderText="End Date" Format="d" Type=ColumnType.Date Width="90" TextAlign="TextAlign.Right"></TreeGridColumn>
                    <TreeGridColumn Field="Duration" HeaderText="Duration" Width="80" TextAlign="TextAlign.Right"></TreeGridColumn>
                    <TreeGridColumn Field="Progress" HeaderText="Progress" Width="80"></TreeGridColumn>
                </TreeGridColumns>
            </SfTreeGrid>

        </div>
    </div>
</div>

@*<div class="col-lg-3 property-section">
        <h4 style="margin-top:38px;">Properties</h4>

        <table id="property" style="width: 90%; height: 350px;">
            <tr>
                <td class="left-side" style="padding-right:15px;">Allow Paging</td>
                <td>
                    <SfCheckBox ID="paging" Checked="true"></SfCheckBox>
                </td>
            </tr>

            <tr>
                <td class="left-side" style="padding-right:15px;">Page Size Mode</td>
                <td>
                    <SfDropDownList ID="sizemode" Index="0" PopupWidth="110px" DataSource="@sizemode" Change="@ModeChange">
                        <DropDownListFieldSettings text="id" value="type"></DropDownListFieldSettings>
                    </SfDropDownList>
                </td>
            </tr>
            <tr>
                <td class="left-side" style="padding-right:15px;">Page Size</td>
                <td>
                    <SfNumericTextBox id="pagesize" value="10" format="##" min="1" max="36"></SfNumericTextBox>
                </td>
            </tr>
            <tr>
                <td class="left-side" style="padding-right:15px;">Page Count</td>
                <td>
                    <SfNumericTextBox id="pagecount" value="2" format="##" min="1" max="4"></SfNumericTextBox>
                </td>
            </tr>
            <tr>
                <td class="left-side" style="padding-right:15px;">Current Page</td>
                <td>
                    <SfNumericTextBox id="currentpage" value="1" format="##" min="1" max="17"></SfNumericTextBox>
                </td>
            </tr>
        </table>
    </div>*@

@code{

    public class SizeMode
    {
        public string Id { get; set; }
        public string Type { get; set; }
    }

    List<SizeMode> SizeModes = new List<SizeMode>()
    {
        new SizeMode(){ Id= "All", Type= "All" },
        new SizeMode(){ Id= "Root", Type= "Root" },
    };

    public BusinessObject[] TreeGridData { get; set; }

    protected override void OnInitialized()
    {
        this.TreeGridData = TreeData.GetDefaultData().Cast<BusinessObject>().ToArray();
    }    
}
